<template>
  <div class="footer">
  </div>
</template>

<script>
  import { link } from '@/common/constants/footerConfig';

  export default {
    name: 'tf-footer',
    data () {
      return {
        link: link
      };
    }
  };
</script>

<style lang="less" scoped>
  .footer {
    padding-top: 50px;
    height: 35px;
    line-height: 30px;
    color: #C6C8CC;
    background-color: #434856;
    display: table;
    width: 100%;
    font-size: 13px;
    .content{
      width: 1000px;
      margin: auto;
      .logo{
      }
      .main{
        display: flex;
        margin-bottom: 10px;
        .title-a{
          font-size: 14px;
          color: #FFFFFF;
          line-height: 30px;
          margin-top: 10px!important;
        }
        .info{
          flex: 9;
          margin-top: 12px;
          font-size: 13px;
          color: #C6C8CC;
          p{
            margin: 0;
            line-height: 26px;
            span{
              width: 12px;
              height: 10px;
              display: inline-block;
              margin-right: 6px;
            }
            .mobile{
              background: url(/static/img/main/phone.png) center center / cover no-repeat;
            }
            .email{
              background: url(/static/img/main/email.png) center center / cover no-repeat;
            }
            .sz{
              background: url(/static/img/main/sz.png) center center / cover no-repeat;
            }
            .bj{
              background: url(/static/img/main/bj.png) center center / cover no-repeat;
            }
            .nmg{
              background: url(/static/img/main/nmg.png) center center / cover no-repeat;
            }
          }
        }
        .link{
          margin-top: 10px!important;
          flex: 5;
          .title-a{
            margin-bottom: 0;
          }
          a{
            display: block;
            color: #C6C8CC;
            width: 105px;
            line-height: 28px;
          }
        }
        .qrcode{
          margin-top: 10px!important;
          flex: 6;
          position: relative;
          >div{
            width: 100px;
            display: inline-block;
            height: 40px;
            position: absolute;
            bottom: 20px;
            a{
              display: block;
            width: 100%;
            height: 100%;
            cursor: pointer;
            }
          }
          .one{
            left: 0;
          }
          .two{
            left: 100px;
          }
          .three{
            left: 200px;
          }
        }
      }
    }
    .company{
      text-align: center;
      color: #747988;
      p{
        margin: 0;
        background-color: #3d414e;
        padding: 10px 0;
      }
    }
  }
</style>
